<template>
  <div class="my_statistics">
    <div class="my_statistics_table">
      <el-table
        v-loading="loading"
        :data="tableData"
        border
        style="width: 100%"
        @row-click="get"
        empty-text="暂无数据"
      >
        <el-table-column prop="articleTitle" label="标题" :resizable="false" :formatter="chageText"></el-table-column>
        <el-table-column prop="createTime" label="分享时间" width="180" :resizable="false"></el-table-column>
        <el-table-column prop="browseTotal" label="阅读量" width="180" :resizable="false"></el-table-column>
      </el-table>
    </div>
    <div class="pageList">
      <paging ref="paging_zi" @CurrentPage="accept_CurrentValue" />
    </div>
  </div>
</template>

<script>
import paging from "../../../components/paging.vue";
import { postRequest, commonRequest } from "../../../api/api.js";
export default {
  name: "statistics",
  components: {
    paging
  },
  data() {
    return {
      tableData: [],
      loading: true // 添加了loading
    };
  },
  mounted() {
    this.ArticleSharelist();
  },
  methods: {
    get(val) {
      this.$router.push("/VIP/statistics_setails?id=" + val.id);
    },
    chageText(row, column, cellValue, index) {
      if (cellValue.length >= 31) {
        return cellValue.slice(0, 31) + ".....";
      }
      return cellValue;
    },
    accept_CurrentValue: function(value) {
      console.log(value);
    },
    ArticleSharelist() {
      this.loading = true;
      commonRequest("/api/ums/umsArticleShare/list").then(res => {
        // console.log(res);
        this.loading = false;
        this.tableData = res.records;
        this.$refs.paging_zi.totalValue(res.pages);
      });
    }
  }
};
</script>

<style lang="less" scoped>
.my_statistics {
  width: 900px;
  .my_statistics_table {
    margin-bottom: 20px;
  }
  .pageList {
    height: 100px;
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
  }
}
</style>
